<template>
  <div class="home1">
    <div class="gg">
      <input
        type="text"
        name="username"
        placeholder="账号"
        v-model="username"
      />
      <input
        type="password"
        name="password"
        placeholder="密码"
        v-model="password"
      />
      <br />
      <button @click="onSubmit">立即登录</button>
    </div>
    <!-- <van-button type="warning" to="/about">login</van-button> -->
  </div>
</template>

<script>
import { getLogin } from "@/request/api";
export default {
  data() {
    return {
      username: "",
      password: "",
    };
  },
  methods: {
    onSubmit() {
      getLogin({
        username: this.username,
        password: this.password,
      }).then((res) => {
        if (res.errCode == 0) {
          console.log(res);
          localStorage.setItem("token", res.data);

          this.$toast("登录成功");
          setTimeout(() => {
            this.$router.push("/about");
          }, 800);
        }
      });
    },
  },
};
</script>

<style scoped>
.home1 {
  width: 100vw;
  height: 100vh;
  background-image: url("../assets/登录页.jpg");
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.gg {
  padding-top: 22rem;
  text-align: center;
}
.gg input {
  width: 70%;
  height: 40px;
  margin-bottom: 20px;
  /* margin: 0.5rem 5rem;
  padding: 0.5rem; */
}
button {
  width: 100px;
  height: 40px;
  background: orange;
}
</style>